﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="OfflineScans.aspx.cs" Inherits="OfflineScans" %>

<asp:Content ID="Content1" ContentPlaceHolderID="BodyContent" runat="Server">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/qtip2/2.1.1/jquery.qtip.min.js" type="text/javascript"></script>
    <div class="contentfull">
        <div class="breadcrumbs">
            <ul id="crumbs">
                <li><a title="My Account" href="#">My Account</a>
                    <img src="Content/Images/separator.png" alt="&rarr;" class="separator">
                    Scans 			</li>
            </ul>
        </div>

        <div id="showMessages"></div>

        <div class="fwrapper">
            <div class="top">
                <div class="innerleft">
                    <h1 class="left">Scans</h1>
                </div>
            </div>

            <div class="content">
                <div class="tabs_box">
                    <ul id="tabs">
                        <li><a href="Scans.aspx" class="tabs_off">All Scans</a></li>
                        <li><a href="OnlineScans.aspx" class="tabs_off">Online Scans</a></li>
                        <li><a href="OfflineScans.aspx" class="tabs_on">Offline Scans</a></li>
                       <%-- <li><a href="ScansUpload.aspx" class="tabs_off">Scan Uploads</a></li>--%>
                        <li><a href="BulkScanRemoval.aspx" class="tabs_off">Bulk Scan Removal</a></li>
                        <%--<li><a href="ExportScanTemplates.aspx" class="tabs_off">
                            <img src="#" alt="New Feature" style="height: 34px; width: 34px;" />
                            Export templates</a></li>--%>
                    </ul>
                </div>

                <div class="all_sm g_left_med three_med five_lg">


                    <div class="filter_form">
                        <div class="filterscans">
                            <h2>Filter</h2>

                            <form id="searchFilterForm" action="OfflineScans.aspx">


                                <label for="values">Student Id Number / Student Name</label>
                                <input class="newscan" tabindex="0" name="q" value="" type="text" id="values" /><br />
                                <label for="dt_date_start">From</label>
                                <input class="date" tabindex="1" name="sd" value="" type="text" id="dt_date_start" />
                                <input class="time" tabindex="2" name="st" value="" type="text" id="dt_time_start" /><br />
                                <label for="dt_date_end">To</label>
                                <input class="date" tabindex="3" name="ed" value="" type="text" id="dt_date_end" />
                                <input class="time" tabindex="4" name="et" value="" type="text" id="dt_time_end" />

                               

                                <br />
                                <br />

                                <div class="scans-menu">
                                    <a href="#" id="showServicesList" class="small up">
                                        <div class="arrow"></div>
                                        <img src="Images/service16.png" alt="Services" />Buttons</a>
                                    <div id="servicesList" class="indent1">
                                    </div>
                                    <script type="text/javascript">
                                        $(function () {
                                            $("servicesList").hide();
                                            $("#showServicesList").click(function () {
                                                var l = $("#servicesList");
                                                if (l.data('loaded') && l.is(":hidden")) {
                                                    l.slideDown();
                                                } else if (l.is(":hidden")) {
                                                    // l.load("/account/scans/", "action=getlist&listtype=services").slideDown();
                                                    l.load("GetServices.aspx").slideDown();
                                                    l.data('loaded', true);
                                                } else {
                                                    l.slideUp('');
                                                }
                                                $(this).toggleClass('down');
                                                return false;
                                            });
                                        });
                                    </script>
                                </div>

                                <div class="scans-menu">
                                    <a href="#" id="showUsersList" class="small up">
                                        <div class="arrow"></div>
                                        <img src="Images/user16.png" alt="Users" />Staff</a>
                                    <div id="usersList" class="indent1">
                                    </div>
                                    <script type="text/javascript">
                                        $(function () {
                                            $("usersList").hide();
                                            $("#showUsersList").click(function () {
                                                var l = $("#usersList");
                                                if (l.data('loaded') && l.is(":hidden")) {
                                                    l.slideDown();
                                                } else if (l.is(":hidden")) {
                                                    l.load("GetUsers.aspx").slideDown();
                                                    l.data('loaded', true);
                                                } else {
                                                    l.slideUp('');
                                                }
                                                $(this).toggleClass('down');
                                                return false;
                                            });
                                        });
                                    </script>
                                </div>

                                <div class="scans-menu">
                                    <a href="#" id="showDevicesList" class="small up">
                                        <div class="arrow"></div>
                                        <img src="Images/device16.png" alt="Devices" />Devices</a>
                                    <div id="devicesList" class="indent1">
                                    </div>
                                    <script type="text/javascript">
                                        $(function () {
                                            $("devicesList").hide();
                                            $("#showDevicesList").click(function () {
                                                var l = $("#devicesList");
                                                if (l.data('loaded') && l.is(":hidden")) {
                                                    l.slideDown();
                                                } else if (l.is(":hidden")) {
                                                    l.load("GetDevices.aspx").slideDown();
                                                    l.data('loaded', true);
                                                } else {
                                                    l.slideUp('');
                                                }
                                                $(this).toggleClass('down');
                                                return false;
                                            });
                                        });
                                    </script>
                                </div>

                                <input type="hidden" name="clicker" value="1" />
                                <input type="hidden" id="page_hidden_input" name="page" value="1" />
                                <input type="hidden" id="orderBy_hidden_input" name="orderBy" value="timestamp" />
                                <input type="hidden" id="orderAscOrDesc_hidden_input" name="desc" value="1" />
                                <input type="submit" class="yellow_button ylong" value="Filter" />
                            </form>
                        </div>
                    </div>
                    <div class="filterscans">
                    <h2>Export a CSV File</h2>
                        <form action="#" method="POST">
                            <script type="text/javascript">
                                function ExportData(type) {
                                    window.location.href = "Scans.aspx?type=" + type;
                                }
                            </script>
                            <input type="button" name="doEmail" onclick="return ExportData('email');" value="Email Data" title="Send a CSV file containing these scans to your e-mail address." class="yellow_button ysidebyside" />
                            <input type="button" onclick="return ExportData('export');" name="doDownload" value="Download Data" title="Download a CSV file containing these scans." class="yellow_button ysidebyside" />
                           </form>   
                    </div>
                </div>
                <script type="text/javascript" src="Scripts/jquery.calendrical.js"></script>
                <script src="https://jquery-json.googlecode.com/files/jquery.json-1.3.min.js"></script>
                <script>
                    $(document).ready(function () {
                        $('#dt_date_start, #dt_time_start, #dt_date_end, #dt_time_end').calendricalDateTimeRange({ usa: 1, showFutureOnly: 0 });
                    });
                </script>
                <div class="all_sm g_right_med five_med eleven_lg">
                    <div id="scanSearchResults">
                        <div class="scancount large"><%= this.GetCount()  %></div>

                        <div id="scan_filter_list"></div>

                        <div class="pagination">
                            <ul id="paginator1"></ul>
                        </div>


                        <ul class="data d_scans">
                            <asp:ListView ID="lstvwScans" runat="server" ItemPlaceholderID="itemContainer">
                                <LayoutTemplate>
                                    <asp:PlaceHolder ID="itemContainer" runat="server"></asp:PlaceHolder>
                                </LayoutTemplate>
                                <ItemTemplate>
                                    <li>
                                        <p class="data_action">
                                            <a class="deleteScan" href="#">Delete</a>
                                            <input type="hidden" name="scanid" value="<%# Eval("ScanId") %>" />
                                        </p>
                                        <img src="<%# this.GetValidityImage(Convert.ToInt32(Eval("ValidityCode").ToString())) %>" alt="Recorded / valid scan." class="dataicon" />
                                        <h1><%# Eval("StudentIdNumber") %>  <%# this.GetName(Eval("FirstName").ToString(),  Eval("LastName").ToString() )%> </h1>
                                        <h2><%# Eval("ResponseValue") %></h2>
                                        <dl class="questions group">
                                            <dt>
                                                <img src="Images/questions16.png" alt="Questions" title="Data Collection" class="attr" />
                                                <a class="poll_a" href="#">Questions</a></dt>
                                            <div style="display: none;">
                                                <%# Eval("QuestionText") %>
                                                <%-- <h3>Asset Status</h3>
                                        <p>Pass</p>
                                        <h3>Interest Level</h3>
                                        <p>Very Interested</p>--%>
                                            </div>
                                        </dl>
                                        <dl class="questions group">
                                            <dt>
                                                <img src="Images/questions16.png" alt="Properties" title="Data Collection" class="attr" />
                                                <a class="poll_a" href="#">Properties</a></dt>
                                            <div style="display: none;">
                                                <%-- <p><b>Capture Type</b>:  								search_submit 							</p>--%>
                                                <p><b>Timezone</b>: <%# StaticData.GetTimeZones()[Eval("TimeZone").ToString()] %></p>
                                            </div>
                                        </dl>

                                        <dl class="meta group">
                                            <p>
                                                <dt>
                                                    <img src="Images/time16.png" alt="Timestamp" title="Timestamp" class="attr" />
                                                </dt>
                                                <dd><a href="#" title="Only show scans made on <%# Eval("CreateDate") %>"><%# Eval("CreateDate") %></a></dd>

                                                <dt>
                                                    <img src="Images/service16.png" alt="Service" title="Service" class="attr" /></dt>
                                                <dd><a href="#" title="Only show scans made with <%# Eval("ServiceName") %>" id="a_service_578958"><%# Eval("ServiceName") %></a></dd>
                                            </p>

                                            <p>
                                                <dt>
                                                    <img src="Images/device16.png" alt="Device" title="Device" class="attr" /></dt>
                                                <dd><a href="#" title="Only show scans made using <%# Eval("DeviceName") %>" id="a_device_131856"><%# Eval("DeviceName") %></a></dd>

                                                <dt>
                                                    <img src="Images/user16.png" alt="User" title="User" class="attr" /></dt>
                                                <dd><a href="#" title="Only show scans made by <%# Eval("UserName") %>" id="a_user_134786"><%# Eval("UserName") %></a></dd>
                                            </p>
                                        </dl>
                                    </li>
                                </ItemTemplate>
                                <EmptyDataTemplate>
                                    <div>
                                        Sorry - No Scans Found
                                    </div>
                                </EmptyDataTemplate>
                            </asp:ListView>
                        </ul>
                        
                        <script type="text/javascript">
                            $(document).ready(function () {

                                var messengerDiv = $("div#showMessages");

                                // quick adding values to the database

                                $("a.deleteScan").live("click", function (event) {
                                    var tr = $(this).parent().parent();
                                    var value = $(this).parent().find("input:hidden[name=scanid]").val();
                                    var loading_icon = '<img src="Images/loading-white.gif"/>';
                                    $(this).parent().html(loading_icon);
                                    var _data = '<?xml version="1.0" encoding="utf-8"?>' +
                                            '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' +
                                            '<soap:Body>' +
                                                '<ArchiveScans xmlns="http://tempuri.org/">' +
                                                    ' <clientId>0</clientId>' +
                                                    '<scanId>' + value + '</scanId>' +
                                                    ' <hashCode>test</hashCode>' +
                                                    '</ArchiveScans>' +
                                                '</soap:Body>' +
                                           '</soap:Envelope>';
                                    $.ajax({
                                        type: "POST",
                                        contentType: "text/xml;charset-uf8",
                                        dataType: "xml",
                                        url: "http://ssica.org/services/Scans.asmx?op=ArchiveScans",
                                        data: _data,
                                        success: function (msg) {
                                            var result = $("ArchiveScansResult", msg);
                                            var res = $(result).text();
                                            tr.fadeOut().remove();
                                            messengerDiv.removeClass().addClass("success");
                                            var showMessage = 'Scan has been deleted.';
                                            if (messengerDiv.is(":empty")) {
                                                messengerDiv.empty().append("<p></p>").append("<li>" + showMessage + "</li>").hide().slideDown();
                                            } else {
                                                messengerDiv.hide().empty().append("<p></p>").append("<li>" + showMessage + "</li>").fadeIn();
                                            }
                                        }
                                    });
                                    return false;
                                });


                                $("a[class='poll_a']").click(function () {
                                    $(this).parent().next().slideToggle();
                                    return false;
                                });

                                $("#paginator1 a, #paginator2 a").click(function () {
                                    $("#page_hidden_input").val($(this).text());
                                    $("#searchFilterForm").submit();
                                    return false;
                                });

                                $("#orderbyService, #orderbyDevice, #orderbyUser, #orderbyBarcode, #orderbyResult, #orderbyTimestamp").click(function () {

                                    var orderByArray = {
                                        orderbyService: 'service', orderbyDevice: 'device', orderbyUser: 'user',
                                        orderbyBarcode: 'barcode', orderbyResult: 'response', orderbyTimestamp: 'timestamp'
                                    };

                                    if ($("#orderBy_hidden_input").val() == orderByArray[$(this).attr('id')]) {
                                        if ($("#orderAscOrDesc_hidden_input").val() == 1) {
                                            $("#orderAscOrDesc_hidden_input").val(0);
                                        } else {
                                            $("#orderAscOrDesc_hidden_input").val(1);
                                        }
                                    } else {
                                        $("#orderBy_hidden_input").val(orderByArray[$(this).attr('id')]);
                                        $("#orderAscOrDesc_hidden_input").val(0);
                                    }
                                    $("#page_hidden_input").val(1);
                                    $("#searchFilterForm").submit();
                                    return false;
                                });


                            });
                        </script>
                        <div class="pagination">
                            <ul id="paginator2">
                            </ul>
                        </div>
                        <br />
                    </div>
                </div>
            </div>
        </div>
        <!-- /.contentfull -->
</asp:Content>
